<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>登录</title>

<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" href="dist/css/bootstrap.css">
<link rel="stylesheet" href="dist/css/font-awesome-4.4.0/font-awesome.min.css">
<link rel="stylesheet" href="css/AdminLTE.css">

</head>
<body class="login-page">
	<div class="login-box">
		<div class="loginlogo">
			<i class="fa fa-book"></i>
		</div>
		<div class="login-box-body">
			<p class="login-box-msg login-maintext">学生选课系统</p>
			<form method="post" class="loginform">
				<div class="form-group has-feedback" style="height:30px;">
					<span id="freediv" style="display:none;">123</span>					
				</div>
				<div class="form-group has-feedback">
					<input type="text" class="form-control login-inputtext" placeholder="学号" id="loadno">
					<i class="fa fa-user form-control-feedback loginfa"></i>
				</div>
				<div class="form-group has-feedback">
					<input type="password" class="form-control login-inputtext" placeholder="密码" id="loadpass"> 
					<i class="fa fa-lock form-control-feedback loginfa"></i>
				</div>
				<div class="row">
					<div class="col-xs-12">
						<div class="col-xs-4" style="padding: 0;">
							<input type="text" class="form-control login-inputtext" placeholder="验证码" id="checknum">
						</div>
						<div class="col-xs-8" style="padding-right: 0; height: 45px;">
							<img id="img" border="0" src="identity-code" /> 
							<a class="btn refresha" data-toggle="tooltip" title="看不清 ?换一张" href="javascript:refresh()"> 
								<i class="fa fa-refresh form-control-feedback loginfa"></i>
							</a>
						</div>
					</div>
					<div class="col-xs-12">
						<input id="sub" type="button" onClick="loading()" 
							value="登  录" class="btn btn-primary btn-block btn-flat loginbutton">
					</div>
				</div>
				<div align="center" style="margin-top:5px;">
					<a href="chpassword">修改密码</a>
				</div>								
			</form>
		</div>
	</div>

	<script src="js/app.js"></script>
	<script src="dist/js/jquery-2.2.3.min.js"></script>
	<script src="dist/js/bootstrap.js"></script>
	
	<script type="text/javascript">	
	//获取新的验证码			
	function refresh() {
		document.getElementById("img").src="identity-code?" + Math.random();
	}
	
	function freeOut(){
		$("#freediv").fadeOut(2000);
	}
	
	//登录验证
	function loading() {			
		if(testno && testpass && testchecknum) {
			$.ajax({
				url:'/ui/checkload',
				data:{
					loadno : $("#loadno").val(),
					loadpass : $("#loadpass").val(),
					checknum : $("#checknum").val()
				},
				type:'POST',
				dataType:"text",
				success:function(data){						
					if(data.indexOf("y")>=0) {
						window.location.href = "main";
					} else {
						$("#freediv").css("color","#d73925");
						$("#freediv").html("<i class='fa fa-close'></i> "+data);
						$("#freediv").show();
						setTimeout(freeOut,1000);
					} 			
				},
				error:function() {
				    $("#freediv").css("color","#d73925");
					$("#freediv").html("<i class='fa fa-close'></i> 系统错误,请重试");
					$("#freediv").show();
					setTimeout(freeOut,1000);
				} 
			});
		}
	}
	
	//对登录账号进行验证
	var testno = false;
	$("#loadno").blur(function() {			
		var loadno = $("#loadno").val();
		if(loadno == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='fa fa-close'></i> 学号不能为空");
			$("#freediv").show();
			setTimeout(freeOut,1000);
			testno = false;
		} else {
			testno = true;
		} 
	});
	
	//对密码的验证
	var testpass = false;
	$("#loadpass").blur(function() {			
		var pass = $("#loadpass").val();
		if(pass == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='fa fa-close'></i> 密码不能为空");
			$("#freediv").show();
			setTimeout(freeOut,1000);
			testpass = false;
		} else {
			testpass = true;
		}
	});
	
	//对验证码的检查
	var testchecknum = false;
	$("#checknum").blur(function() {				
		var cnum = $("#checknum").val();
		if (cnum == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='icon fa fa-close'></i> 验证码不能为空");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testchecknum = false;
		} else {
			testchecknum = true;
		}
	});
	</script>
</body>
</html>
<%-- 
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<c:set var="contextPath" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Log in with your account</title>

    <link href="resources/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="resources/static/css/common.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>

<div class="container">

    <form method="POST" action="/login" class="form-signin">
        <h2 class="form-heading">Log in</h2>

        <div class="form-group ${error != null ? 'has-error' : ''}">
            <span>${message}</span>
            <input name="username" type="text" class="form-control" placeholder="Username"
                   autofocus="true"/>
            <input name="password" type="password" class="form-control" placeholder="Password"/>
            <span>${error}</span>
            <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>

            <button class="btn btn-lg btn-primary btn-block" type="submit">Log In</button>
        </div>

    </form>

</div>
<!-- /container -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="resources/static/js/bootstrap.min.js"></script>
</body>
</html> --%>